Quiero aprender a programar: aprende HTML, CSS y Javascript

Ayer estuve hablando con un amigo que quiere actualizarse profesionalmente. Hasta ahora ha estado haciendo sus aplicaciones utilizando Visual Basic Script for Applications, especialmente enfocado en aplicaciones sobre Access.

Se siente bien programando, está viviendo la crisis como el resto de nosotros y ha pensado que sería interesante buscar alguna forma de hacerse rico a través de la web/aplicaciones móviles/etc... Es decir, más o menos, lo mismo que  he pensado yo alguna que otra vez...

Dejaré de banda la parte más márketiniana de nuestra conversación, sobre cómo hacer llegar la aplicación al público y esas cosas y me centraré en aquello que creo que puede ser de más utilidad.

Si tienes que aprender a programar, ¿por dónde empiezas?

Mi respuesta es: por la web. No importa si en el fondo a ti lo que te gusta son las aplicaciones móviles o las aplicaciones de escritorio: el futuro está en la web. Las aplicaciones móviles nativas tienen muchas ventajas sobre las aplicaciones que simplemente son un iconito en el teléfono que te lleva hasta la aplicación web. Sin embargo, una aplicación móvil basada en la web no está restringida a un determinado tipo de teléfono, por ejemplo. Por otro lado, con la llegada de Windows 8, las aplicaciones web también se cuelan en el escritorio (las aplicaciones estilo Metro).

Así que lo más sensato, desde mi punto de vista, es aprender aquellas tecnologías con las que se construye la web: HTML, CSS y Javascript.

HTML se encarga de la estructura de la página web. CSS permite especificar la presentación y finalmente  Javascript es el músculo y el cerebro que permite mover todo lo anterior...

Por orden creciente de dificultad, lo más sencillo de aprender es HTML. La última especificación de este estándard es HTML5 e incluye mogollón de nuevas funcionalidades que permiten hacer cosas que antes eran muy complicadas de hacer. Parte de esta complicación es que cada versión de cada navegador, de cada sistema operativo funcionaba de una forma diferente. Gracias a HTML5 -que es un estándard, no hay que olvidarlo- todos los navegadores trabajan del mismo modo.

En realidad lo anterior no es cierto del todo; pero la situación ha mejorado tanto que casi todo el mundo vive  feliz ignorando las pequeñas diferencias actuales entre los diferentes navegadores (HTML5 Rocks, oh yeah!)

La cosa se complica con CSS. No porque las hojas de estilo en cascada sean más complicadas, sino porque aquí estamos tratando de la presentación; las hojas de estilo forman parte de la identidad visual de una sitio web. Por ello, el proceso de pasas del diseño inicial a lo que muestra el navegador es más complicado de lo que podría parecer. Además de las diferencias de interpretación que hacen los navegadores a la hora de presentar la web al usuario, la web no surgió con la idea de hacer que el contenido fuera bonito (eso vino después), por lo que siempre ha sido complicado lograr que la información se muestre como uno quiere. Piensa, por ejemplo, en lo diferente que es realizar un diseño de un folleto, que sabes que se imprimirá sobre un papel con unas medidas concretas a lo que supone hacer que una página web se vea bien para un amplio rango de resoluciones y tamaños de pantalla (de los 640x480 de las primeras pantallas a los 2880x1800 de la retina display del MacBook Pro). Y eso sin tener en cuenta la llegada de los smartphones y los tablets al terreno de juego...
Los diseñadores intentan exprimir al máximo las capacidades de CSS3, la última versión del estándard, creando todo tipo de pirotecnias visuales (busca en Google, por ejemplo).


HTML y CSS no son lenguajes de programación; lo único que hacen es indicar cómo debe presentar el navegador un determinado contenido. Sin embargo, Javascript sí que es un lenguaje de programación, lo que permite, como indica la Wikipedia:

Un lenguaje de programación es un idioma artificial diseñado para expresar procesos que pueden ser llevadas a cabo por máquinas como las computadoras.

Javascript es lo que permite que la web cobre vida, que las páginas web hagan algo, más allá de mostrar información de manera estática.

La relación entre Javascript y la web viene de lejos. Al principio, Javascript era un jugador de segunda, que se utilizaba para desplegar menús y añadir efectos especiales a las páginas web. A la combinación de ambos se le llamaba DHTML, HTML Dinámico.

Sin embargo, la relación entre Javascript y HTML (y CSS) cambió de manera importante cuando se empezó a utilizar lo que ahora llamamos AJAX. Aunque la tecnología existía desde mucho antes (desde el 1996!!), el boom de las RIA (las aplicaciones de internet enriquecidas) me atrevería a decir que llegó con   Google Maps. De pronto los programadores vieron que Javascript podía utilizarse para algo más que desplegar menús y simular que nieva en una página web... Fue como si de pronto todo el mundo se diera cuenta de que Javascript es un lenguaje de programación de verdad y se lanzaran a hacer cosas que nadie se había animado a hacer antes... Como comentan en estas entradas de RWW, se ha ejecutado Linux, un emulador de GameBoy e incluso se consiguió ejecutar una DOOM (un juego clásico de 1993) en Javascript dentro de un navegador.

Como ves, la potencia de Javascript lo convierte en la pieza más complicada de aprender del triplete HTML/CSS/Javascript.

A medida que aumenta la dificultad, sin embargo, también aumentan las ayudas que puedes encontrar en forma de frameworks o de librerías como Bootstrap (para CSS) o JQuery (para Javascript). No sustituyen el aprendizaje a pelo de CSS o Javascript, pero te pueden facilitar la vida. Así podrás concentrarte en tu idea, en lo que quieres hacer... Al fin y al cabo, esa idea es lo más importante de todo el proceso.

Nota: He actualizado la entrada para corregir el texto del enlace que aparece en el primer párrafo: no era "Visual Basic Script for Applications", sino "Visual Basic for Applications".